<!--
 * @Description: 
 * @Version: 1.0
 * @Autor: younghxp
 * @Date: 2021-11-08 15:41:54
 * @LastEditors: younghxp
 * @LastEditTime: 2021-11-24 18:24:42
-->
<template>
  <div class="wrapBox">
    <el-form
      :model="formData"
      :rules="rules"
      ref="ruleForm"
      label-width="150px"
      class="ruleForm"
    >
      <table cellspacing="0" cellpadding="0" border="1" class="tableBox">
        <tbody>
          <tr>
            <td class="leftTd">
              <p class="index text fontColorTheme">1.</p>
              <p class="title text fontColorTheme">投保项目</p>
            </td>
            <td class="rightTd">
              <el-form-item label="投保项目名称：">
                <span class="desc">{{ formData.projectName }}</span>
              </el-form-item>
              <el-form-item label="保函类型：" prop="guaranteeType">
                <el-select
                  class="inputStyle"
                  v-model="formData.guaranteeType"
                  placeholder="请选择"
                  clearable
                  @change="changeType"
                  :disabled="isDisabled"
                >
                  <el-option
                    v-for="item in guaranteeTypeOptions"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="承保机构：" prop="underwriting">
                <el-select
                  class="inputStyle"
                  v-model="formData.underwriting"
                  placeholder="请选择"
                  clearable
                  @change="changeUnderwriting"
                  :disabled="isDisabled"
                >
                  <el-option
                    v-for="item in underwritingOptions"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="保函有效期：" style="margin-bottom: 0">
                <el-form-item
                  class="inlineInp"
                  label=""
                  label-width="0"
                  prop="guaranteeStartDate"
                >
                  <el-date-picker
                    class="inputMoneyStyle"
                    type="date"
                    placeholder="请选择生效日期"
                    v-model="formData.guaranteeStartDate"
                    :picker-options="expireTimeOption"
                    value-format="yyyy-MM-dd"
                  ></el-date-picker>
                  &nbsp;至&nbsp;
                </el-form-item>
                <el-form-item
                  class="inlineInp"
                  label=""
                  label-width="0"
                  prop="guaranteeEndDate"
                >
                  <el-date-picker
                    class="inputMoneyStyle"
                    type="date"
                    placeholder="请选择失效日期"
                    v-model="formData.guaranteeEndDate"
                    value-format="yyyy-MM-dd"
                  ></el-date-picker>
                </el-form-item>
                <div style="color: #999999; font-weight: 400; margin-top: 10px">
                  原则上应投保至工程建设项目竣工（交工）验收合格之日起6个月内
                </div>
              </el-form-item>
              <el-form-item label="差异化缴存：" prop="differentDeposit">
                <el-select
                  class="inputStyle"
                  v-model="formData.differentDeposit"
                  placeholder="请选择"
                  clearable
                  @change="changeDifferentDeposit"
                >
                  <el-option
                    v-for="item in differentDepositOptions"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="">
                <div class="tipRadioBox">
                  <el-radio v-model="radio" label="1"
                    >我已知晓：请按项目实际情况选择，如监管部门审核不符，将不予通过且后续仅可通过现金形式缴纳保证金；</el-radio
                  >
                </div>
              </el-form-item>
              <el-form-item label="投保金额：" prop="guaranteeAmount">
                <el-input
                  class="inputMoneyStyle"
                  v-model.trim="formData.guaranteeAmount"
                  disabled
                ></el-input
                >&nbsp;元
              </el-form-item>
              <div
                style="
                  font-size: 14px;
                  line-height: 20px;
                  color: #999999;
                  font-weight: 400;
                  margin: -5px 0 6px 150px;
                "
              >
                填入项目需缴纳的保证金
              </div>
              <el-form-item label="项目地址：" prop="address">
                <el-input
                  class="inputAddressStyle"
                  v-model.trim="formData.address"
                  type="textarea"
                  :rows="2"
                  maxlength="128"
                  show-word-limit
                ></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td class="leftTd">
              <p class="index text fontColorTheme">2.</p>
              <p class="title text fontColorTheme">投保方</p>
              <p class="desc text fontColorTheme">即项目施工方</p>
            </td>
            <td class="rightTd">
              <el-form-item label="投保企业名称：" prop="companyName">
                <el-input
                  class="inputStyle"
                  v-model.trim="formData.companyName"
                  maxlength="100"
                  show-word-limit
                ></el-input>
              </el-form-item>
              <el-form-item label="统一社会信用代码：" prop="uscc">
                <el-input
                  class="inputStyle"
                  v-model.trim="formData.uscc"
                ></el-input>
              </el-form-item>
              <el-form-item label="施工资质等级：" prop="level">
                <el-select
                  class="inputStyle"
                  v-model="formData.level"
                  placeholder="请选择"
                  clearable
                >
                  <el-option
                    v-for="item in levelOptions"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="联系人姓名：" prop="contacts">
                <el-input
                  class="inputStyle"
                  v-model.trim="formData.contacts"
                  maxlength="20"
                  show-word-limit
                ></el-input>
              </el-form-item>
              <el-form-item label="手机号码：" prop="contactsTel">
                <el-input
                  class="inputStyle"
                  v-model.trim="formData.contactsTel"
                ></el-input>
              </el-form-item>
              <el-form-item label="保单收件人：" prop="addressee">
                <el-input
                  class="inputStyle"
                  v-model.trim="formData.addressee"
                  maxlength="20"
                  show-word-limit
                ></el-input>
              </el-form-item>
              <el-form-item label="收件人手机号：" prop="addresseeTel">
                <el-input
                  class="inputStyle"
                  v-model.trim="formData.addresseeTel"
                ></el-input>
              </el-form-item>
              <el-form-item label="保单收件地址：" prop="receivingAddress">
                <el-input
                  class="inputAddressStyle"
                  v-model.trim="formData.receivingAddress"
                  type="textarea"
                  :rows="2"
                  maxlength="128"
                  show-word-limit
                ></el-input>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td class="leftTd">
              <p class="index text fontColorTheme">3.</p>
              <p class="title text fontColorTheme">受益人</p>
            </td>
            <td class="rightTd">
              <el-form-item label="受益人：" style="margin-bottom: 0">
                <span class="desc"
                  >投保人依法招用的{{ formData.projectName }}农民工</span
                >
              </el-form-item>
            </td>
          </tr>
          <enclosure
            v-if="fileOptions.length > 0"
            :fileOptions="fileOptions"
            @uploadSuccess="uploadSuccess"
            ref="enclosure"
            @uploadAllData="uploadAllData"
            :editUploadData="editUploadData"
            :type="type"
          ></enclosure>
        </tbody>
      </table>
      <div class="btnBox">
        <el-button
          type="primary"
          @click="submitForm('ruleForm')"
          class="commonBtn confirmBtn"
          :loading="isSaveLoading"
        >
          <span>提交登记</span>
        </el-button>
        <el-button
          type="primary"
          @click="cancleForm"
          class="commonBtn cancleBtn"
        >
          <span>取消</span>
        </el-button>
      </div>
    </el-form>
  </div>
</template>

<script>
import enclosure from './enclosure.vue'

export default {
  name: 'insuranceReg',
  props: {
    type: {
      type: String,
      default: '',
    },
    id: {
      type: String,
      default: '',
    },
  },
  components: {
    enclosure,
  },
  data() {
    var validateMoney = (rule, value, callback) => {
      let reg = /^(([1-9]\d*)(\.\d{1,2})?|0\.([1-9]|\d[1-9])|0)$/
      if (!reg.test(value)) {
        callback(new Error('支持整数或两位小数'))
      } else if (value * 1 > 100000000 || value * 1 < 100) {
        callback(new Error('在100元 ~ 1亿元之间'))
      } else {
        callback()
      }
    }
    var checkStartDate = (rule, value, callback) => {
      if (value) {
        if (this.formData.guaranteeEndDate) {
          let start = new Date(value).getTime()
          let end = new Date(this.formData.guaranteeEndDate).getTime()
          if (end >= start) {
            this.$refs.ruleForm.clearValidate('guaranteeEndDate')
            callback()
          } else {
            callback(new Error('失效日期不得小于生效日期'))
          }
        } else {
          callback(new Error('请选择保险失效日期'))
        }
      } else {
        callback(new Error('请选择生效日期'))
      }
    }
    var checkEndDate = (rule, value, callback) => {
      if (value && this.formData.guaranteeStartDate) {
        if (this.formData.guaranteeStartDate) {
          let start = new Date(this.formData.guaranteeStartDate).getTime()
          let end = new Date(value).getTime()
          if (end >= start) {
            this.$refs.ruleForm.clearValidate('guaranteeStartDate')
            callback()
          } else {
            callback(new Error('失效日期不得小于生效日期'))
          }
        } else {
          callback(new Error('请选择生效日期'))
        }
      } else {
        callback(new Error('请选择保险失效日期'))
      }
    }
    return {
      expireTimeOption: {
        disabledDate(date) {
          //disabledDate 文档上：设置禁用状态，参数为当前日期，要求返回 Boolean
          // 只能选择三天以后
          return date.getTime() < Date.now() + 2 * 24 * 60 * 60 * 1000
        },
      },
      projectId: '',
      formData: {
        projectName: '',
        guaranteeType: '', //保函类型
        guaranteeStartDate: '',
        guaranteeEndDate: '',
        guaranteeAmount: '', //担保金额
        address: '',
        companyName: '',
        uscc: '',
        level: '', //施工资质等级
        contacts: '', //联系人姓名
        contactsTel: '', //手机号码
        addressee: '', //保单收件人
        addresseeTel: '', //收件人手机号
        receivingAddress: '', //保单收件地址
        differentDeposit: '', //差异化，
        underwriting: '',
      },
      fileOptions: [
        // {
        //     id: 0,
        //     type: 'businessLicense',
        //     name: '工商营业执照',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id:1,
        //     type: 'levelCertificate',
        //     name: '资质等级证书',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 2,
        //     type: 'constructionContract',
        //     name: '项目施工合同',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 3,
        //     type: 'application',
        //     name: '缴存申请表',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 4,
        //     type: 'invoiceHeader',
        //     name: '企业发票抬头（专票）',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 5,
        //     type: 'biddingDocuments',
        //     name: '项目招标文件',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 6,
        //     type: 'biddingNotice',
        //     name: '项目中标通知书',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 7,
        //     type: 'commencementOrder',
        //     name: '开工令',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 9,
        //     type: 'constructionProFile',
        //     name: '《建设工程施工合同》协议书部分复印件',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 10,
        //     type: 'legalPersonFile',
        //     name: '法人身份证照片',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 11,
        //     type: 'safetyPermitFile',
        //     name: '安全生产许可证',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 12,
        //     type: 'insuranceFormFile',
        //     name: '投保单并盖章',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 13,
        //     type: 'specialWageFile',
        //     name: '农民工工资专用账户',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 14,
        //     type: 'constitutionFile',
        //     name: '公司章程',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 15,
        //     type: 'resolutionFile',
        //     name: '董事会决议等授权文件',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 16,
        //     type: 'financeReportFile',
        //     name: '近三年及一期财务报表/审计报告',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 17,
        //     type: 'counterGuaranteeFile',
        //     name: '反担保协议',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 18,
        //     type: 'licenceFile',
        //     name: '银行开户许可证或基本户证明复印件',
        //     prop: true,
        //     isUpload: false,
        //     error: false,
        // },
        // {
        //     id: 8,
        //     type: 'otherFile',
        //     name: '其他资料',
        //     prop: false,
        //     isUpload: false,
        //     error: false,
        // },
      ],
      rules: {
        guaranteeType: {
          required: true,
          message: '请选择保函类型',
          trigger: 'change',
        },
        guaranteeStartDate: [
          { required: true, validator: checkStartDate, trigger: 'change' },
        ],
        guaranteeEndDate: [
          { required: true, validator: checkEndDate, trigger: 'change' },
        ],
        guaranteeAmount: [
          { required: true, message: '请输入投保金额', trigger: 'change' },
          { validator: validateMoney, trigger: 'change' },
        ],
        address: { required: true, message: '请输入项目地址', trigger: 'blur' },
        companyName: {
          required: true,
          message: '请输入企业名称',
          trigger: 'blur',
        },
        uscc: [
          {
            required: true,
            message: '请输入统一社会信用代码',
            trigger: 'blur',
          },
          {
            required: true,
            pattern: /^[0-9A-Z]{2}[0-9]{6}[0-9A-Z]{10}$/,
            message: '统一社会信用代码格式错误',
            trigger: 'blur',
          },
        ],
        level: {
          required: true,
          message: '请选择施工资质等级',
          trigger: 'change',
        },
        contacts: {
          required: true,
          message: '请输入联系人姓名',
          trigger: 'blur',
        },
        contactsTel: [
          { required: true, message: '请输入手机号码', trigger: 'blur' },
          {
            required: true,
            pattern: /^1[3456789]\d{9}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur',
          },
        ],
        addressee: {
          required: true,
          message: '请输入保单收件人',
          trigger: 'blur',
        },
        addresseeTel: [
          { required: true, message: '请输入收件人手机号', trigger: 'blur' },
          {
            required: true,
            pattern: /^1[3456789]\d{9}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur',
          },
        ],
        receivingAddress: {
          required: true,
          message: '请输入保单收件地址',
          trigger: 'blur',
        },
        underwriting: {
          required: true,
          message: '请选择承保机构',
          trigger: 'blur',
        },
        differentDeposit: {
          required: true,
          message: '请选择差异化缴存',
          trigger: 'change',
        },
      },
      guaranteeTypeOptions: [], //保函类型下拉
      levelOptions: [], //施工资质等级下拉
      isSaveLoading: false,
      underwritingOptions: [], //承保类型下拉
      differentDepositOptions: [], //差异化缴存
      files: {}, //子组件给父组件传的所有附件值
      editUploadData: {},
      radio: '',
      areaId: '',
      isDisabled: false,
    }
  },
  created() {
    this.projectId = this.$store.state.projectId
    this.formData.projectName = this.$store.state.projectName
  },
  async mounted() {
    this.getLevelOptions()
    if (this.type === 'update' || this.type === 'renew') {
      this.isDisabled = true
      await this.getInsuranceDetail(this.id)
    } else {
      this.isDisabled = false
      let curTime = new Date().getTime()
      let nextTime = curTime + 3 * 24 * 60 * 60 * 1000
      let nextDate =
        new Date(nextTime).getFullYear() +
        '-' +
        (new Date(nextTime).getMonth() + 1) +
        '-' +
        new Date(nextTime).getDate()
      this.formData.guaranteeStartDate = nextDate
      this.getProjectInfo(this.projectId)
    }
    if (this.$route.query.insuretype) {
      this.formData.guaranteeType = this.$route.query.insuretype
    }
    await this.getInsureType('DEPOSIT_INSURE_TYPE') //保险类型
    this.getInsureType('DIFFERENCE_PAY')
  },
  methods: {
    //获取项目详情
    getProjectInfo(projectId) {
      return this.axios({
        method: 'post',
        url: 'api-p/project/expand/projectdetail',
        data: {
          projectId,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.formData.address = response.data.result.address
            this.formData.companyName = response.data.result.pbName
            this.formData.uscc = response.data.result.pbUscc
            this.areaId = response.data.result.areaId
            if (
              response.data.result.endDate &&
              (this.type !== 'update' || this.type !== 'renew')
            ) {
              let arr = response.data.result.endDate.split('-')
              if (arr[1] * 1 + 6 > 12) {
                arr[0] = arr[0] * 1 + 1
                arr[1] = arr[1] * 1 + 6 - 12
              } else {
                arr[1] = arr[1] * 1 + 6
              }
              this.formData.guaranteeEndDate = arr.join('-')
            }
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    //修改带入详情
    getInsuranceDetail(id) {
      var newData
      if (this.type === 'renew') {
        newData = {
          id,
          isRenew: '1',
        }
      } else {
        newData = {
          id,
        }
      }
      return this.axios({
        method: 'post',
        url: 'api-d/depositinsinsure/expand/detail',
        data: newData,
      })
        .then((response) => {
          if (!response.data.hasError) {
            const { result } = response.data
            this.editUploadData = result.fileList
            this.projectId = result.projectId
            this.formData.projectName = result.projectName
            this.formData.guaranteeType = result.insureType
            this.formData.guaranteeStartDate =
              result.startDate && result.startDate.split('.').join('-')
            this.formData.guaranteeEndDate =
              result.lastDate && result.lastDate.split('.').join('-')
            this.formData.guaranteeAmount = result.insureAmount
            this.formData.address = result.projectAddress
            this.formData.companyName = result.companyName
            this.formData.uscc = result.uscc
            this.formData.level = result.qualification
            this.formData.contacts = result.linkName
            this.formData.contactsTel = result.linkTel
            this.formData.addressee = result.insureAddressee
            this.formData.addresseeTel = result.addresseeTel
            this.formData.receivingAddress = result.address
            this.formData.differentDeposit = result.diffPayId
            this.formData.underwriting = result.insureOrg
            this.radio = '1'
            this.areaId = result.areaId
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    // 保函类型字典
    getInsureType(type) {
      this.axios({
        method: 'post',
        // url: "api-d/depositinsinsure/expand/getinsuretype",
        url: 'api-bs/base/dicitem/findbytype',
        data: {
          type: type,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            if (type == 'DEPOSIT_INSURE_TYPE') {
              this.guaranteeTypeOptions = response.data.result
            } else {
              this.differentDepositOptions = response.data.result
            }
            // 承保机构
            this.getAgency()
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    // 承保机构
    getAgency(type) {
      this.axios({
        method: 'post',
        url: '/api-d/insconfiginsurers/findByInsureType',
        data: {
          insureType: this.formData.guaranteeType,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.underwritingOptions = response.data.result
            if (type == 'change') {
              this.formData.underwriting = ''
            } else {
              if (this.$route.query.agency) {
                this.formData.underwriting = this.$route.query.agency
              }
            }
            // 获取投保机构所需附件
            if (this.formData.underwriting) {
              this.getInsureEnclosure()
            }
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    changeType() {
      this.getAgency('change')
    },
    // 资质等级字典
    getLevelOptions() {
      this.axios({
        method: 'post',
        url: 'api-d/depositinsinsure/expand/getqltype',
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.levelOptions = response.data.result
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    submitForm(formName) {
      if (this.radio == '') {
        this.$message({
          type: 'warning',
          message: '请先选中我已知晓',
        })
        return false
      }
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let flag = true
          this.fileOptions.forEach((v) => {
            if (v.prop && !v.isUpload) {
              flag = false
              v.error = true
            }
          })
          if (flag) {
            this.isSaveLoading = true
            this.$refs.enclosure.uploadData()
            let url = 'api-d/depositinsinsure/expand/add'
            if (this.type === 'update') {
              url = 'api-d/depositinsinsure/expand/modify'
            }
            let data = {
              projectId: this.projectId, //项目Id
              insureType: this.formData.guaranteeType, //投保类型
              startDate: this.formData.guaranteeStartDate, //保函有效期起始时间
              lastDate: this.formData.guaranteeEndDate, //保函有效期截止时间
              insureAmount: this.formData.guaranteeAmount, //担保金额
              projectAddress: this.formData.address, //项目地址
              companyName: this.formData.companyName, //担保企业名称
              uscc: this.formData.uscc,
              qualification: this.formData.level, //施工资质等级
              linkTel: this.formData.contactsTel, //联系人电话
              linkName: this.formData.contacts, //联系人
              insureAddressee: this.formData.addressee, //保单收件人
              addresseeTel: this.formData.addresseeTel, //保单收件人电话
              address: this.formData.receivingAddress, //保单收件地址
              files: JSON.stringify(this.files), //附件组合
              insureOrg: this.formData.underwriting,
              diffPayId: this.formData.differentDeposit,
              areaId: this.areaId,
            }
            if (this.type === 'update') {
              Object.assign(data, { id: this.id })
            } else {
              if (this.type === 'renew') {
                Object.assign(data, { isRenew: '1' })
              } else {
                Object.assign(data, { isRenew: '0' })
              }
            }

            this.axios({
              method: 'post',
              url,
              data,
            })
              .then((response) => {
                if (!response.data.hasError) {
                  this.$message.success('保存成功')
                  this.$emit('changeStep', '2')
                  this.$emit('changeStatus', 'ORGAUDITING')
                  this.$emit('changeIsDetail', false)
                  this.$emit('changeId', response.data.result.id)
                } else {
                  this.$message.error(response.data.errorMsg)
                }
                this.isSaveLoading = false
              })
              .catch((error) => {
                if (error.response) {
                  this.$message.error(error.response.data)
                }
                this.isSaveLoading = false
              })
          } else {
            return false
          }
        } else {
          this.fileOptions.forEach((v) => {
            if (v.prop && !v.isUpload) {
              v.error = true
            }
          })
          return false
        }
      })
    },
    cancleForm() {
      this.$router.push({
        path: '/home/newInsurance/insuranceOrder',
        name: 'insuranceOrder',
      })
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: '/home/newInsurance/insuranceOrder',
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    // 修改带入附件
    // bringAttach(type, oldScr, src, index) {
    //     if (type.length) {
    //         this.fileOptions[index].isUpload = true
    //         type.forEach(v => {
    //             this[oldScr].push(v.url)
    //             this[src].push(v.url)
    //         })
    //     }
    // },
    // 上传成功赋值
    uploadSuccess(res) {
      this.fileOptions = res
    },
    // 上传所有的值
    uploadAllData(files) {
      this.files = files
    },
    // 切换差异化缴存带入投保金额
    changeDifferentDeposit() {
      this.axios({
        method: 'post',
        url: 'api-d/depositinsinsure/expand/getInsureAmount',
        data: {
          projectId: this.projectId,
          dicitemId: this.formData.differentDeposit,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.formData.guaranteeAmount = response.data.result
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    // 获取投保附件
    getInsureEnclosure() {
      this.axios({
        method: 'post',
        url: 'api-d/depositinsinsure/expand/getInsureOrgFile',
        data: {
          insureId: this.id && this.type != 'renew' ? this.id : '',
          // insureId:"",
          insureOrgId: this.formData.underwriting,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.fileOptions = response.data.result
            if (this.editUploadData) {
              this.fileOptions.forEach((v) => {
                for (let k in this.editUploadData) {
                  if (
                    this.editUploadData[k] &&
                    this.editUploadData[k].length > 0
                  ) {
                    if (v.id == k) {
                      v.isUpload = true
                    }
                  }
                }
              })
            }
            console.log(this.fileOptions)
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    // 切换承保机构获取附件
    changeUnderwriting() {
      this.fileOptions = []
      this.getInsureEnclosure()
    },
  },
}
</script>

<style lang="less" scoped>
.wrapBox {
  width: 100%;
  height: 100%;
  margin-top: 27px;
  .tableBox {
    width: 100%;
    border-color: #dcdfe6;
    border-collapse: collapse;
    .leftTd {
      width: 160px;
      background: #f8f9fb;
      padding: 20px 32px;
      .text {
        color: #265faa;
        font-weight: 500;
      }
      .index {
        font-size: 40px;
        line-height: 50px;
      }
      .title {
        font-size: 20px;
        margin-top: 10px;
      }
      .desc {
        font-size: 14px;
      }
    }
    .rightTd {
      width: calc(100% - 160px);
      padding: 20px 15px;
      .inputStyle {
        width: 320px;
      }
      .inputMoneyStyle {
        width: 145px;
      }
      .inputAddressStyle {
        width: 550px;
      }
      .desc {
        font-size: 14px;
        font-weight: 400;
        color: #666666;
      }
      .inlineInp {
        display: inline-block;
      }
    }
    .lastRightTd {
      height: 380px;
      padding: 0;
      font-size: 0;
      .titleBox {
        width: 200px;
        height: 100%;
        display: inline-block;
        vertical-align: top;
        border-bottom: none;
        padding: 0;
        margin-bottom: 0;
        .tabTitle {
          width: 100%;
          height: calc(100% / 9);
          .textBox {
            width: 100%;
            border: 1px solid #dcdfe6;
            border-left: none;
            border-top: none;
            height: 100%;
            // line-height: 100%;
            position: relative;
            .mark {
              border-left: 10px solid #46a3ff;
              border-top: 10px solid #46a3ff;
              border-right: 10px solid transparent;
              border-bottom: 10px solid transparent;
              position: absolute;
              top: 0;
              left: 0;
              .right {
                font-size: 12px;
                color: #fff;
                position: absolute;
                top: -12px;
                left: -9px;
                transform: rotateZ(15deg);
              }
            }
            .nameText {
              display: inline-block;
              font-size: 14px;
              line-height: 20px;
              color: #333333;
              font-weight: 400;
              vertical-align: top;
              position: relative;
              top: 50%;
              transform: translateY(-50%);
            }
            .noProp {
              margin-left: 40px;
            }
            .star {
              width: 40px;
              padding-right: 5px;
              text-align: right;
              font-size: 16px;
              color: #d81e06 !important;
              transform: translateY(-40%);
            }
            .error {
              color: #d81e06;
              font-size: 12px;
              position: absolute;
              left: 50px;
              bottom: 0;
            }
          }
          .textBoxCur {
            border-right: none;
            .nameText {
              color: #48a6ff;
            }
          }
          &:last-child .textBox {
            border-bottom: none !important;
          }
        }
      }
      .fileBox {
        width: calc(100% - 200px);
        height: 100%;
        display: inline-block;
        padding: 24px;
        .fileInfo {
          position: relative;
          p {
            font-size: 16px;
            color: #333333;
            font-weight: 700;
          }
          .demo {
            position: absolute;
            top: 2px;
            left: 120px;
          }
        }
      }
    }
  }
  table,
  tr,
  td,
  th,
  thead,
  tbody {
    border: 1px solid #dcdfe6;
  }
  .btnBox {
    height: 115px;
    text-align: center;
    .commonBtn {
      width: 136px;
      height: 36px;
      position: relative;
      top: 50%;
      transform: translateY(-50%);
    }
    .cancleBtn {
      border-color: #999 !important;
      background-color: #fff !important;
      color: #666 !important;
    }
  }
  .tipRadioBox {
    width: 550px;
    height: 32px;
    .el-radio:last-child {
      white-space: normal;
      word-break: break-all;
      word-wrap: break-word;
    }
  }
}
</style>
